<template>
  <el-container>
    <Aside></Aside>
    <el-container style="flex-direction: column">
      <Header></Header>
      <Main></Main>
    </el-container>
  </el-container>
</template>

<script lang="ts" setup>
import { ref, reactive } from "vue";
import Aside from "@/components/menu/aside.vue";
import Header from "@/components/menu/header.vue";
import Main from "@/components/menu/main.vue";


</script>

<style lang="scss" scoped>
.el-header,
.el-footer {
  background-color: #b3c0d1;
  color: #333;
  line-height: 60px;
}

.el-aside {
  background-color: #001529;
  color: #333;
  height: 100vh;
}

.el-main {
  background-color: #e9eef3;
  color: #333;
}
</style>
